<template>
  <view class="container" @click="toDetail()">
    <view class="image">
      <up-image :show-loading="true" :src="'https://'+(item.defaultImg||item.images[0])" width="200rpx"
                height="250rpx"></up-image>
    </view>
    <view class="content">
      <text class="u-line-2">{{ item.goodsName }}
      </text>

      <view class="author">
        <text>{{ item.author }}</text>
        <text>&nbsp; | &nbsp;</text>
        <text>{{ item.publishingHouse }}</text>
      </view>

      <view style="margin-top: 17rpx">
        <u-tag text="自营" mode="dark" type="error" plain></u-tag>
        <u-tag text="限时抢" mode="dark" type="error" style="margin-left: 15rpx"></u-tag>
      </view>

      <view style="margin-top: 17rpx">
        <text class="price">￥{{ item.price || item.itemPrice }}</text>
      </view>

      <view v-if="item.count">
        <view style="text-align: end;color: #B0B0B0">×{{ item.count }}</view>
      </view>
    </view>
  </view>

  <u-line></u-line>
</template>

<script setup lang="ts">
const props = defineProps(['index', 'item'])
const url = "https://picsum.photos/300/200?index=" + props.index;
const item = props.item
const toDetail = () => {
  let id = item.goodsId ? item.goodsId : item.id
  uni.navigateTo({
    url: '/pages/home/goodsDetail/goodsDetail?id=' + id
  })
}
</script>


<style scoped lang="scss">
.container {
  padding: 40rpx;
  display: flex;
  background: white;
  width: 89%;
}

.content {
  margin-left: 15rpx;
  width: 100%;
}

.author {
  margin-top: 17rpx;
  font-size: 20rpx;
  color: #AEAEAE;
}

.price {
  font-size: 30rpx;
  color: #FF3333;
  margin-top: 30rpx;
}
</style>
